<template>
  <section class="d-flex justify-content-between">
    <h2>{{title}}</h2>
    <i class="cubeic-delete" v-if="showDelete" @click="clearSearchHistory"></i>
  </section>
</template>

<script>
import {mapMutations} from 'vuex'
export default {
  name: 'SearchTitle',
  props: {
    title: String,
    showDelete: Boolean
  },
  methods: {
    clearSearchHistory () {
      this.clearSearchHistory()
    },
    ...mapMutations(['clearSearchHistory'])
  }
}
</script>

<style lang="stylus" scoped>
section {
  height 30px
  line-height 30px
  h2, 
  .cubeic-delete{
    color #666!important
  }
}
</style>
